<%--
  Created by IntelliJ IDEA.
  User: Twinkle
  Date: 2021/9/1
  Time: 9:46
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Ajax-Web</title>
</head>
<body>
<input type="text" name="uname" id="un" value="tom">
<input type="button" id="get" value="发送 ajax 请求">
<div id="result"></div>
<script type="text/javascript">
    window.onload = function () {
        var getBtn = document.getElementById("get");
        getBtn.onclick = function () {
            var request = new XMLHttpRequest();
            request.onreadystatechange = function () {
                console.log(request.readyState);
                if (request.readyState === 4 && request.status === 200) {
                    var responseData = request.responseText;
                    console.log(responseData);
                    document.getElementById("result").innerHTML = responseData;
                }
            }
            var url = "${pageContext.request.contextPath}/ajax";
            var queryString = "?uname=" + document.getElementById("un").value;
            request.open("get", url + queryString);
            request.send();
        }
    }
</script>
</body>
</html>
